<template>
    <div>
<!--        引入顶部栏-->
<!--    <head-top></head-top>-->
        <el-row>
            <el-col :span="4" :offset="4">
                <p>{{number}}</p>
            </el-col>
<!--            从浏览器缓存中取数据-->
            <el-col :span="4">
                <el-button @click="show_number_localStorage">show_number_localStorage</el-button>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="4" :offset="4">
                <p>{{number}}</p>
            </el-col>
<!--            从vuex中取数据-->
            <el-col :span="4">
                <el-button @click="show_number_vuex">show_number_vuex</el-button>
            </el-col>
        </el-row>
    </div>
</template>

<script>
    //import headTop from '@/components/Header'

    export default {
        name: "show",

        components: {
            //headTop
        },

        data() {
            return {
                'number': 0
            }
        },

        methods: {
            show_number_localStorage() {
                this.number = localStorage.getItem('number');
            },

            show_number_vuex() {
                this.number = this.$store.state.number;
            }
        }
    }
</script>

<style scoped>

</style>